(function () {
  const id = location.search.substring(4);
  const cmurl = 'http://124.223.14.236:3001';

  // ===============> 获取菜单详情
  async function getMenuData() {
    const { data: { data } } = await axios.get(`${cmurl}/api/recipe/${id}`,)
    // console.log(data);
    const menuDetail = data;
    console.log(menuDetail);
    const img = cmurl + '/public/' + menuDetail.img;
    document.querySelector('.container .left img').src = img;
    document.querySelector('.container .right h3').innerHTML = menuDetail.name;
    document.querySelector('.container .right p').innerHTML = menuDetail.description;
  }
  getMenuData()


  //===============>渲染美食列表
  async function renderList() {
    const { data: { data } } = await axios.get(`${cmurl}/api/recipeInfo/`, {
      params: {
        recipe_id: id,
      },
    })
    console.log(data);
    const list = data;
    if (list.length) {
      let listStr = list
        .map((item, index) => {
          const { img, title, id } = item;
          return `
        <li>
          <a href="food_detail.html?id=${id}">
            <img src=${cmurl + '/public/' + img} alt="" />
            <h3>${title}</h3>
          </a>
        </li>
      `;
        })
        .join('');
      document.querySelector('#list-box').innerHTML = listStr;
    } else {
      document.body.innerHTML += '<p class="noinfo">没有美食哦...</p>';
    }
  }

  renderList()




})();